<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"
	xmlns:c="http://java.sun.com/jsp/jstl/core">
<head>

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>个人贷款申请</title>

<!-- basic styles -->
<link rel="stylesheet" href="moban/vendor/css/bootstrap.min.css" />
<link rel="stylesheet"
	href="moban/vendor/font-awesome-4.7.0/css/font-awesome.min.css" />


<!--[if IE 7]>
    <link rel="stylesheet" href="moban/vendor/css/font-awesome-ie7.min.css"/>
    <![endif]-->

<!-- page specific plugin styles -->

<link rel="stylesheet" href="moban/vendor/css/select2.css" />

<!-- fonts -->

<link rel="stylesheet" href="moban/vendor/css/css.css" />

<!-- ace styles -->

<link rel="stylesheet" href="moban/vendor/css/ace.min.css" />
<link rel="stylesheet" href="moban/vendor/css/ace-rtl.min.css" />
<link rel="stylesheet" href="moban/vendor/css/ace-skins.min.css" />

<!--[if lte IE 8]>
    <link rel="stylesheet" href="moban/vendor/css/ace-ie.min.css"/>
    <![endif]-->

<!--引入自己写的样式-->

<link href="moban/css/unlogin.css" rel="stylesheet">
<link href="moban/css/base.css" rel="stylesheet">
<!--引入自己写的样式-->
<link href="moban/css/common.css" rel="stylesheet">
<!-- inline styles related to this page -->

<!-- ace settings handler -->

<script src="moban/script/ace-extra.min.js"></script>

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->

<!--[if lt IE 9]>
    <script src="moban/script/html5shiv.js"></script>
    <script src="moban/script/respond.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/cssreset-min.css">
    <link rel="stylesheet" type="text/css" href="css/common.css">

    <![endif]-->

<style type="text/css">
.citys {
	margin-bottom: 10px;
}

.citys p {
	line-height: 28px;
}

.warning {
	color: #c00;
}

.main a {
	margin-right: 8px;
	color: #369;
}
</style>





<!--=========================计算授信额度公式的函数=============================-->
<script languang="javascript">
	function difen(fen) {

		var fuhaoposition = fen.indexOf("~");
		var lowmark;
		if (fuhaoposition != -1)
			lowmark = fen.substring(0, fuhaoposition)
		else
			lowmark = fen
		lowmark = parseInt(lowmark);
		return lowmark;
	}

	function gaofen(fen) {

		var fuhaoposition = fen.indexOf("~");
		var highmark;
		if (fuhaoposition != -1)
			highmark = fen.substring(fuhaoposition + 1, fen.length)
		else
			highmark = fen
		highmark = parseInt(highmark);
		return highmark;
	}

	function main() {
		//debugger;

		var low = 0;
		var high = 0;
		for (i = 0; i <= 6; i++) {
			fen1 = document.pingji.elements[i].value;
			low = low + difen(fen1);
			high = high + gaofen(fen1);
		}

		if (document.pingji.elements[7].checked)
			fen1 = document.pingji.elements[7].value
		else {
			if (document.pingji.elements[8].checked)
				fen1 = document.pingji.elements[8].value
			else
				fen1 = document.pingji.elements[9].value
		}
		low = low + difen(fen1);
		high = high + gaofen(fen1);

		/* if(low<60)
			string = "您的信用贷款额度最低为0！"
		else{ */
		if (low < 70)
			string = "您的信用贷款额度最低为5万！"
		else {
			if (low < 80)
				string = "您的信用贷款额度最低为10万元！"
			else {
				if (low < 90)
					string = "您的信用贷款额度最低为15万元！"
				else
					string = "您的信用贷款额度最低为20万元！"
			}
		}

		/* if(low<60)
			string = "您的信用贷款额度最低为0！"
		else{  */
		if (high < 70)
			string1 = "您的信用贷款额度最高为5万！"
		else {
			if (high < 80)
				string1 = "您的信用贷款额度最高为10万元！"
			else {
				if (high < 90)
					string1 = "您的信用贷款额度最高为15万元！"
				else
					string1 = "您的信用贷款额度最高为20万元！"
			}
		}

		//var markes=low+"~"+high;
		var str = string + string1;
		return str;
	}
</script>

</head>
<body class="">
	<header th:replace="front/headtail/header :: header"></header>
	<div class="main-container" id="main-container">

		<div class="main-container-inner" style="background-color: #f4f4f4">
			<a class="menu-toggler" id="menu-toggler" href="#"> <span
				class="menu-text"></span>
			</a>

			<div class="container">
				<div class="page-content" style="background-color: #f4f4f4">
					<!-- /.page-header -->
					<div class="row">
						<div class="col-xs-12">
							<!-- PAGE CONTENT BEGINS -->
							<div class="row-fluid">
								<div class="span12">
									<div class="widget-box">
										<div
											class="widget-header widget-header-blue widget-header-flat">
											<h4 class="lighter">申请贷款流程</h4>
										</div>

										<div class="widget-body">
											<div class="widget-main">
												<div id="fuelux-wizard" class="row-fluid"
													data-target="#step-container">
													<ul class="wizard-steps">
														<li data-target="#step1" class="active"><span
															class="step">1</span> <span class="title">录入个人信息</span></li>

														<li data-target="#step2"><span class="step">2</span>
															<span class="title">提交贷款申请</span></li>

														<li data-target="#step3"><span class="step">3</span>
															<span class="title">审核中</span></li>

														<li data-target="#step4"><span class="step">4</span>
															<span class="title">签订合同</span></li>
													</ul>
												</div>

												<hr />
												<div class="step-content row-fluid position-relative"
													id="step-container">
													<!--**************************************************第1步************************************************************-->
													<div class="step-pane active" id="step1">
														<form class="form-horizontal" id="from_one">
															<div class="row">
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-md-4 control-label no-padding-right text-right">*姓名：</label>

																	<div class="col-xs-4 col-md-4">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custName" th:value="${session.user.userName}"
																			class="width-70"  readonly="readonly"/>
																		</span>
																	</div>
																	<div class="help-block col-md-4 col-sm-reset inline Name">
																	</div>

																</div>
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-3 col-md-3 control-label no-padding-right text-right">*性别：</label>
																	<div class="col-xs-4 col-md-4">
																		<span class="block input-icon input-icon-right">
																			<input type="checkbox" th:name="custSex" th:id="boy" checked value="男"/>男
																			<input type="checkbox" th:name="custSex" th:id="girl"  value="女"/>女
																		</span>
																	</div>
																	<div
																		class="help-block col-xs-4 col-md-4 col-sm-reset inline Sex red">
																	</div>
																</div>
															</div>

															<div class="row">
																
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-4 col-md-3 control-label no-padding-right text-right">*身份证号：</label>
																	<div class="col-xs-4 col-md-5">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custIDcardNo" id="custIDcardNo" 
																			value="" class="width-80"/>
																		</span>
																	</div>
																	<div
																		class="help-block col-xs-4 col-md-3 col-sm-reset inline IDcardNo red">
																	</div>
																</div>
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-md-4 control-label no-padding-right text-right">年龄：</label>
																	<div class="col-xs-4 col-md-5">
																		<span class="block input-icon input-icon-right">
																			<input type="text" id="age" class="width-70" th:name="BirthAge" readonly="readonly"/>
																			<input type="hidden" name="age" id="BirthAge_id">
																		</span>
																	</div>
																	<div class="help-block col-md-3 col-sm-reset red inline BirthAge">
																	</div>
																</div>
																
															</div>



															<div class="row">
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-4 control-label no-padding-right text-right">*手机号码：</label>

																	<div class="col-xs-4 col-md-5">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custTele" readonly="readonly"
																			class="width-70" th:value="${session.user.userphone}" />
																		</span>
																	</div>
																	<div class="help-block col-md-3 col-sm-reset inline Tele red">
																	</div>

																</div>
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-3 col-md-3 control-label no-padding-right text-right">*职位&#45;&#45;工作岗位：</label>
																	<div class="col-xs-4 col-md-6">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custJob" class="width-70" />
																		</span>
																	</div>
																	<div
																		class="help-block col-xs-4 col-md-3 col-sm-reset inline Job red">
																	</div>
																</div>
															</div>


															<div class="row">
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-4 control-label no-padding-right text-right">*公司电话：</label>

																	<div class="col-xs-4 col-md-5">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custCompContTele" 
																			class="width-70" />
																		</span>
																	</div>
																	<div class="help-block col-md-3 col-sm-reset inline CompContTele red">
																	</div>
																</div>
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-3 col-md-3 control-label no-padding-right text-right">*月收入：</label>
																	<div class="col-xs-4 col-md-6">
																		<span class="block input-icon input-icon-right">
																			<input type="number" step="0.01" min="1"
																			th:name="custSteadyWages" class="width-70" />
																		</span>
																	</div>
																	<div
																		class="help-block col-xs-4 col-md-3 col-sm-reset inline SteadyWages red">
																	</div>
																</div>
															</div>

															<div class="row">
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-4 control-label no-padding-right text-right">*学历：</label>

																	<div class="col-xs-4 col-md-5">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="education" 
																			class="width-70" />
																		</span>
																	</div>
																	<div class="help-block col-md-3 col-sm-reset inline xueli red">
																	</div>

																</div>
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-3 col-md-3 control-label no-padding-right text-right">*家庭财产评估价值：</label>
																	<div class="col-xs-4 col-md-6">
																		<span class="block input-icon input-icon-right">
																			<input type="number" step="0.01" min="1"
																			th:name="familyValue" class="width-70"  />
																		</span>
																	</div>
																	<div
																		class="help-block col-xs-4 col-md-3 col-sm-reset inline family red">
																	</div>
																</div>
															</div>

															<div class="row">
																<div class="form-group has-info col-md-6 row">
																	<label
																		class="col-xs-4 col-sm-4 control-label no-padding-right text-right">*婚姻状况：</label>

																	<div class="col-xs-4 col-md-5">
																		<span class="block input-icon input-icon-right">
																			<select th:name="custMarried" class="width-70" id="custMarried_sele">
																				<option value="">请选择</option>
																				<option value="未婚">未婚</option>
																				<option value="已婚">已婚</option>
																			</select>
																		</span>
																	</div>
																	<div class="help-block col-md-3 col-sm-reset inline Married red">
																	</div>
																</div>
																<div class="form-group has-info col-md-6 row" id="div_custMateName" style="display: none;">
																	<label
																		class="col-xs-4 col-sm-3 col-md-3 control-label no-padding-right text-right">*配偶姓名：</label>
																	<div class="col-xs-4 col-md-6">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custMateName" class="width-70"  />
																		</span>
																	</div>
																	<div
																		class="help-block col-xs-4 col-md-3 col-sm-reset inline MateName red">
																	</div>
																</div>
															</div>


															<div class="row">
																<div class="form-group has-info col-md-6 row"  id="div_custMateTele" style="display: none;">
																	<label
																		class="col-xs-4 col-sm-4 control-label no-padding-right text-right">*配偶电话：</label>

																	<div class="col-xs-4 col-md-5">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custMateTele" 
																			class="width-70" />
																		</span>
																	</div>
																	<div class="help-block col-md-3 col-sm-reset inline MateTele red">
																	</div>

																</div>
																<div class="form-group has-info col-md-6 row"  id="div_custMateIDcardNo" style="display: none;">
																	<label
																		class="col-xs-4 col-sm-3 col-md-3 control-label no-padding-right text-right">*配偶身份证：</label>
																	<div class="col-xs-4 col-md-6">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custMateIDcardNo" 
																			class="width-70"/>
																		</span>
																	</div>
																	<div
																		class="help-block col-xs-4 col-md-3 col-sm-reset inline MateIDcardNo red">
																	</div>
																</div>
															</div>

															<div class="row">
																<div class="form-group has-info col-md-6 row"  id="div_custMateJob" style="display: none;">
																	<label
																		class="col-xs-4 col-sm-4 control-label no-padding-right text-right">*配偶职业：</label>

																	<div class="col-xs-4 col-md-5">
																		<span class="block input-icon input-icon-right">
																			<input type="text" th:name="custMateJob" 
																			class="width-70" /> 
																		</span>
																	</div>
																	<div class="help-block col-md-3 col-sm-reset inline MateJob red">
																	</div>
																</div>
															</div>
															<input type="hidden" th:name="custHomeaAdress" id=""/> 
															<input type="hidden" th:name="custPresentAdress" id="" />
															<input type="hidden" th:name="custJobCompany" id="" />
														</form>
														<!--地址3级连动-->
														<div class="row">
															<div class="form-group has-info col-md-11 row">
																<label
																	class=" col-sm-2 control-label no-padding-right text-right">*家庭住址：</label>

																<div class=" width-auto">
																	<div id="demo3" class="citys">
																		<p>
																			<select id="homeone" name="province"></select> <select
																				id="hometwo" name="city"></select> <select
																				id="homethree" name="area"></select>
																			<!--<select name="town"></select>-->
																			<input type="text" id="homefour" name="" class="" />
																		</p>
																	</div>
																</div>
																<div class="help-block col-md-3 col-sm-reset inline HomeaAdress red"></div>
															</div>
															
														</div>

														<div class="row">
															<div class="form-group has-info col-md-11 row">
																<label
																	class="col-sm-2 control-label no-padding-right text-right">*现住址：</label>

																<div class="width-auto" style="align-content: left">
																	<div id="demo2" class="citys">
																		<p>
																			<select id="nowone" name="province"></select> <select
																				id="nowtwo" name="city"></select> <select
																				id="nowthree" name="area"></select> <input
																				id="nowfour" type="text" name="" />
																		</p>
																	</div>
																</div>
																<div class="help-block col-md-3 col-sm-reset inline PresentAdress red"></div>
															</div>
															
														</div>

														<div class="row">
															<div class="form-group has-info col-md-11 row">
																<label
																	class="col-sm-2 control-label no-padding-right text-right">*在职公司：</label>

																<div class="width-auto">
																	<div id="demo1" class="citys">
																		<p>
																			<select id="jobone" name="province"></select> <select
																				id="jobtwo" name="city"></select> <select
																				id="jobthree" name="area"></select> <input
																				id="jobfour" type="text" name="" />
																		</p>
																	</div>
																</div>
																<div class="help-block col-md-3 col-sm-reset inline JobCompany red"></div>
															</div>
																				
															
														</div>
														<button class="btn btn-success text-right"
															id="addcustomer">
															下一步 <i class="icon-arrow-right icon-on-right"></i>
														</button>
													</div>
													<!--**************************************************第1步************************************************************-->
													
													<!--**************************************************第2步************************************************************-->
													<div class="step-pane" id="step2">
														<div class="center">
															<form class="form-horizontal" enctype="multipart/form-data" id="from_two">
																<div class="row">
																	<div class="form-group has-info col-md-6 row">
																		<input type="hidden" th:id="custIDcardNo" th:name="custIDcardNo">
																		<label
																			class="col-xs-4 col-md-4 control-label no-padding-right text-right">*姓名：</label>
																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<input type="text" name="custName" class="width-70" th:if="${session.user} != null"
																				th:value="${session.user.userName}" readonly="readonly"/>
																			</span>
																		</div>
																		<div class="help-block col-md-4 col-sm-reset inline xingming">
																		</div>
																	</div>
																	<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-sm-3 col-md-4 control-label no-padding-right text-right">*贷款用途：</label>
																		<div class="col-xs-4 col-md-5 ">
																			<span class="block input-icon input-icon-right">
																				<select th:name="purposeId" class="width-90">
																				   <option value="请选择">请选择贷款用途</option>
																				   <option th:each="purposelist : ${purposelist}" th:value="${purposelist.purposeId}"
																				   th:text="${purposelist.purposeName}"></option>
																				</select>

																			</span>
																		</div>
																		<div
																			class="help-block col-xs-4 col-md-3  col-sm-reset inline pName">
																		</div>

																	</div>

																</div>

																<div class="row">
																	<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-md-4 control-label no-padding-right text-right">*紧急联系人1（家人）：</label>

																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<input type="text" name="loanEmerContOne" 
																				class="width-70" />
																			</span>
																		</div>
																		<div class="help-block col-md-3 col-sm-reset inline EmerContOne">
																		</div>

																	</div>
																	<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-sm-4 col-md-4 control-label no-padding-right text-right">*紧急联系人1的联系方式：
																		</label>
																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<input type="text" name="loanTeleOne" 
																				class="width-70" />
																			</span>
																		</div>
																		<div class="help-block col-xs-3 col-md-3 col-sm-reset inline TeleOne"></div>
																	</div>

																</div>


																<div class="row">
																	<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-sm-4 control-label no-padding-right text-right">*紧急联系人2（朋友）：</label>

																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<input type="text" name="loanEmerContTwo" 
																				class="width-70" />
																			</span>
																		</div>
																		<div class="help-block col-md-3 col-sm-reset inline EmerContTwo">
																		</div>

																	</div>
																	<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-sm-4 col-md-4 control-label no-padding-right text-right">*紧急联系人2的联系方式：</label>
																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<input type="text" name="loanTeleTwo" 
																				class="width-70" />

																			</span>
																		</div>
																		<div
																			class="help-block col-xs-4 col-md-3 col-sm-reset inline TeleTwo">
																		</div>
																	</div>

																</div>


																<div class="row">
																	<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-sm-4 control-label no-padding-right text-right">*紧急联系人3（同事）：</label>

																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<input type="text"  name="loanEmerContThree" class="width-70" />
																			</span>
																		</div>
																		<div class="help-block col-md-3 col-sm-reset inline EmerContThree">
																		</div>

																	</div>
																	<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-sm-4 col-md-4 control-label no-padding-right text-right">*紧急联系人3的联系方式：</label>
																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<input type="text"name="loanTeleThree"  class="width-70" required="required"/>
																			</span>
																		</div>
																		<div
																			class="help-block col-xs-4 col-md-3 col-sm-reset inline TeleThree">
																		</div>
																	</div>
																</div>

																<div class="row">
																	<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-sm-3 col-md-4 control-label no-padding-right text-right">*期望贷款金额：</label>
																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<input type="number" name="loanQuota" required="required"
																				class="width-60" min="1" step="0.50"/>万

																			</span>
																		</div>
																		<div
																			class="help-block col-xs-4 col-md-3 col-sm-reset inline Quota">
																		</div>
																	</div>
																<div class="form-group has-info col-md-6 row">
																		<label
																			class="col-xs-4 col-sm-3 col-md-4  control-label no-padding-right text-right">*分期还款方式：</label>

																		<div class="col-xs-4 col-md-5">
																			<span class="block input-icon input-icon-right">
																				<select th:name="StagId" class="width-90" id="StagId_ein">
																				   <option value="请选择还款方式">请选择还款方式</option>
																				   <option th:each="staginglist : ${staginglist}" th:value="${staginglist.stagByNumber}"
																				   th:text="${staginglist.stagByNumber}"></option>
																				</select>期   	<label id="money_one" style="display: none;">
																						   		月供本金<span id="MonthlyPrin"></span>
																						   	</label>
																			</span>
																		</div>
																		<div class="help-block col-md-3 col-sm-reset inline ByNumber"> </div>
																	</div>
																</div>

																<div class="row text-content">
																
																	<div class="form-group has-info col-md-4 ">
																		<label
																			class="col-xs-12 col-sm-12 col-md-12 control-label no-padding-right ">*身份证正面：</label>
																		<div class="col-xs-12 col-md-12">
																			<span class="block input-icon input-icon-right">
																				 <input type="file" name="attachs" id="loanCardJustPath" required="required"/>
																			</span> 
																		</div>
																		<div
																			class="help-block col-xs-12 col-md-12 col-sm-reset inline CardJustPath">
																		</div>
																	</div>
																	<div class="form-group has-info col-md-4 ">
																		<label
																			class="col-xs-12 col-sm-12 control-label  " required="required">*身份证背面：
																		</label>

																		<div class="col-xs-12 col-md-12">
																			<span class="block input-icon input-icon-right">
																				<input type="file" name="attachs" id="loanCardBackPath" required="required"/>
																			</span>
																		</div>
																		<div class="help-block col-md-12 col-sm-reset inline CardBackPath"></div>

																	</div>
																	<div class="form-group has-info col-md-4 ">
																		<label
																			class="col-xs-12 col-sm-12 col-md-12 control-label no-padding-right ">*本人手持身份证照片：
																		</label>
																		<div class="col-xs-12 col-md-12">
																			<span class="block input-icon input-icon-right">
																				<input type="file" name="attachs" id="loanCardPath" required="required"/>
																			</span>
																		</div>
																		<div
																			class="help-block col-xs-12 col-md-12 col-sm-reset inline CardPath">
																		</div>
																	</div>
																</div>
															</form>
														</div>
														<button class="btn btn-success text-right"
															id="addloan">
															下一步 <i class="icon-arrow-right icon-on-right"></i>
														</button>
													</div>
													<!--**************************************************第2步************************************************************-->


													<!--**************************************************第3步************************************************************-->
													<div class="step-pane" id="step3">
														<div class="center">
															<h1 style="font-size: 1.3rem;" class="green">请等待审核!</h1>
															<p></p>
															<p style="font-size: 1.1rem;">您申请的贷款订单已成功提交，后台正在对你信息进行审核......！</p>
														</div>
													</div>
													<!--**************************************************第3步************************************************************-->


													<!--**************************************************第4步************************************************************-->
													<div class="step-pane" id="step4">
														<div class="center">
															<h1 style="font-size: 1.3rem;" class="green">您的贷款已经通过审核，请仔细阅读合同并签订!</h1>
														</div>
													</div>
													<!--**************************************************第4步************************************************************-->
												</div>
												<hr />
												<div class="row-fluid wizard-actions" style="display: none;">
													<button class="btn btn-success btn-next" id="next"
														data-last="Finish" id="clickMe_next">
														下一步 <i class="icon-arrow-right icon-on-right"></i>
													</button>
												</div>
											</div><!-- /widget-main -->
										</div><!-- /widget-body -->
									</div>
								</div>
							</div>
						</div><!-- /.col -->
					</div><!-- /.row -->
				</div><!-- /.page-content -->
			</div><!-- /.main-content -->
		</div><!-- /.main-container-inner -->
	</div><!-- /.main-container -->
	
<!-- 网站底部 -->
<footer th:replace="front/headtail/footer :: footer"></footer>
	
	
	<!--[if !IE]> -->

	<script src="moban/script/jquery.min.js"></script>
	<script type="text/javascript" src="moban/script/jquery.citys.js"></script>

	<!-- <![endif]-->

	<!--[if IE]>
<script src="moban/script/jquery-1.10.2.min.js"></script>
<![endif]-->

	<!--[if !IE]> -->

	<script type="text/javascript">
		window.jQuery
				|| document
						.write("<script src='moban/script/jquery-2.0.3.min.js'>"
								+ "<" + "/script>");
	</script>

	<!-- <![endif]-->

	<!--[if IE]>
<script type="text/javascript">
    window.jQuery || document.write("<script src='assets/js/jquery-2.0.3.min.js'>" + "<" + "/script>");
</script>

<![endif]-->

	<script type="text/javascript">
		if ("ontouchend" in document)
			document
					.write("<script src='moban/script/jquery.mobile.custom.min.js'>"
							+ "<" + "/script>");
	</script>
	<script src="moban/script/bootstrap.min.js"></script>
	<script src="moban/script/typeahead-bs2.min.js"></script>

	<script th:src="@{/moban/script/loanapplication/loanapplication.js}"></script>

	<!-- page specific plugin scripts -->

	<script src="moban/script/fuelux/fuelux.wizard.min.js"></script>
	<script src="moban/script/jquery.validate.min.js"></script>
	<script src="moban/script/additional-methods.min.js"></script>
	<script src="moban/script/bootbox.min.js"></script>
	<script src="moban/script/jquery.maskedinput.min.js"></script>
	<script src="moban/script/select2.min.js"></script>

	<!-- ace scripts -->

	<script src="moban/script/ace-elements.min.js"></script>
	<script src="moban/script/ace.min.js"></script>

	<!-- inline scripts related to this page -->

	<script type="text/javascript">
		var $town = $('#demo1 select[name="town"]');
		var townFormat = function(info) {
			$town.hide().empty();
			if (info['code'] % 1e4 && info['code'] < 7e5) { //是否为“区”且不是港澳台地区
				$.ajax({
					url : 'http://passer-by.com/data_location/town/'
							+ info['code'] + '.json',
					dataType : 'json',
					success : function(town) {
						$town.show();
						for (i in town) {
							$town.append('<option value="'+i+'">' + town[i]
									+ '</option>');
						}
					}
				});
			}
		};
		$('#demo1').citys({
			province : '广东',
			city : '广州',
			area : '白云',
			onChange : function(info) {
				townFormat(info);
			}
		}, function(api) {
			var info = api.getInfo();
			townFormat(info);
		});

		var $town = $('#demo2 select[name="town"]');
		var townFormat = function(info) {
			$town.hide().empty();
			if (info['code'] % 1e4 && info['code'] < 7e5) { //是否为“区”且不是港澳台地区
				$.ajax({
					url : 'http://passer-by.com/data_location/town/'
							+ info['code'] + '.json',
					dataType : 'json',
					success : function(town) {
						$town.show();
						for (i in town) {
							$town.append('<option value="'+i+'">' + town[i]
									+ '</option>');
						}
					}
				});
			}
		};
		$('#demo2').citys({
			province : '广东',
			city : '广州',
			area : '白云',
			onChange : function(info) {
				townFormat(info);
			}
		}, function(api) {
			var info = api.getInfo();
			townFormat(info);
		});

		var $town = $('#demo3 select[name="town"]');
		var townFormat = function(info) {
			$town.hide().empty();
			if (info['code'] % 1e4 && info['code'] < 7e5) { //是否为“区”且不是港澳台地区
				$.ajax({
					url : 'http://passer-by.com/data_location/town/'
							+ info['code'] + '.json',
					dataType : 'json',
					success : function(town) {
						$town.show();
						for (i in town) {
							$town.append('<option value="'+i+'">' + town[i]
									+ '</option>');
						}
					}
				});
			}
		};
		$('#demo3').citys({
			province : '广东',
			city : '广州',
			area : '白云',
			onChange : function(info) {
				townFormat(info);
			}
		}, function(api) {
			var info = api.getInfo();
			townFormat(info);
		});

		jQuery(function($) {
			$('[data-rel=tooltip]').tooltip();

			$(".select2").css('width', '200px').select2({
				allowClear : true
			}).on('change', function() {
				$(this).closest('form').validate().element($(this));
			});

			var $validation = false;
			$('#fuelux-wizard')
					.ace_wizard()
					.on('change', function(e, info) {
						if (info.step == 1 && $validation) {
							if (!$('#validation-form').valid())
								return false;
						}
					})
					.on(
							'finished',
							function(e) {
								bootbox
										.dialog({
											message : "Thank you! Your information was successfully saved!",
											buttons : {
												"success" : {
													"label" : "OK",
													"className" : "btn-sm btn-primary"
												}
											}
										});
							}).on('stepclick', function(e) {
						//return false;//prevent clicking on steps
					});

			$('#skip-validation').removeAttr('checked').on('click', function() {
				$validation = this.checked;
				if (this.checked) {
					$('#sample-form').hide();
					$('#validation-form').removeClass('hide');
				} else {
					$('#validation-form').addClass('hide');
					$('#sample-form').show();
				}
			});

			//documentation : http://docs.jquery.com/Plugins/Validation/validate

			$.mask.definitions['~'] = '[+-]';
			$('#phone').mask('(999) 999-9999');

			jQuery.validator.addMethod("phone", function(value, element) {
				return this.optional(element)
						|| /^\(\d{3}\) \d{3}\-\d{4}( x\d{1,6})?$/.test(value);
			}, "Enter a valid phone number.");

			$('#validation-form')
					.validate(
							{
								errorElement : 'div',
								errorClass : 'help-block',
								focusInvalid : false,
								rules : {
									email : {
										required : true,
										email : true
									},
									password : {
										required : true,
										minlength : 5
									},
									password2 : {
										required : true,
										minlength : 5,
										equalTo : "#password"
									},
									name : {
										required : true
									},
									phone : {
										required : true,
										phone : 'required'
									},
									url : {
										required : true,
										url : true
									},
									comment : {
										required : true
									},
									state : {
										required : true
									},
									platform : {
										required : true
									},
									subscription : {
										required : true
									},
									gender : 'required',
									agree : 'required'
								},

								messages : {
									email : {
										required : "Please provide a valid email.",
										email : "Please provide a valid email."
									},
									password : {
										required : "Please specify a password.",
										minlength : "Please specify a secure password."
									},
									subscription : "Please choose at least one option",
									gender : "Please choose gender",
									agree : "Please accept our policy"
								},

								invalidHandler : function(event, validator) { //display error alert on form submit
									$('.alert-danger', $('.login-form')).show();
								},

								highlight : function(e) {
									$(e).closest('.form-group').removeClass(
											'has-info').addClass('has-error');
								},

								success : function(e) {
									$(e).closest('.form-group').removeClass(
											'has-error').addClass('has-info');
									$(e).remove();
								},

								errorPlacement : function(error, element) {
									if (element.is(':checkbox')
											|| element.is(':radio')) {
										var controls = element
												.closest('div[class*="col-"]');
										if (controls.find(':checkbox,:radio').length > 1)
											controls.append(error);
										else
											error.insertAfter(element.nextAll(
													'.lbl:eq(0)').eq(0));
									} else if (element.is('.select2')) {
										error
												.insertAfter(element
														.siblings('[class*="select2-container"]:eq(0)'));
									} else if (element.is('.chosen-select')) {
										error
												.insertAfter(element
														.siblings('[class*="chosen-container"]:eq(0)'));
									} else
										error.insertAfter(element.parent());
								},

								submitHandler : function(form) {
								},
								invalidHandler : function(form) {
								}
							});

			$('#modal-wizard .modal-header').ace_wizard();
			$('#modal-wizard .wizard-actions .btn[data-dismiss=modal]')
					.removeAttr('disabled');
		})
	</script>
	<script type="text/javascript">
		$(function() {
			$('#loanCardBackPath').ace_file_input({
				style : 'well',
				btn_choose : '请点击上传您的相关证件',
				btn_change : null,
				no_icon : 'icon-cloud-upload',
				droppable : true,
				thumbnail : 'large'
			})
			$('#loanCardPath').ace_file_input({
				style : 'well',
				btn_choose : '请点击上传您的相关证件',
				btn_change : null,
				no_icon : 'icon-cloud-upload',
				droppable : true,
				thumbnail : 'large'
			})
			$('#loanCardJustPath').ace_file_input({
				style : 'well',
				btn_choose : '请点击上传您的相关证件',
				btn_change : null,
				no_icon : 'icon-cloud-upload',
				droppable : true,
				thumbnail : 'large'
			})

		})
	</script>

	<script th:src="@{/moban/vendor/js/businessoptions.js}"></script>
	<script type="text/javascript" th:src="@{/moban/script/publicfile.js}"></script>
</body>
</html>